@charset "utf-8";
@include ns(swiper-container){
  width: 100%;
  .swiper-wrapper{
    height: 200px;
    &:after{ content: ''; clear: both; display: inline-block; }
  }
  .swiper-slide{height: 200px;
    &:nth-child(1){background: #2d8cf0}
    &:nth-child(2){background: #999}
    &:nth-child(3){background: #c6e2ff}
  }
  .direction-nav{
    a{position: absolute;display: block;width: 30px;height: 30px;top: 50%;transform: translateY(-50%);left: 20px;z-index: 10;
      &:after{content: '';display: block;border-top: 1px solid #666;border-right: 1px solid #666;width: 100%;height: 100%;;transform: rotate(-135deg)}
      &.swiper-next{right: 20px;left: auto;
        &:after{transform: rotate(45deg)}
      }
    }
  }
  .control-nav{
    position: absolute; left: 0; bottom: 0; width: 100%; text-align: center; z-index: 10;
    a{ display: inline-block; vertical-align: middle; width: 6px; height: 6px; border-radius: 50%; background: #fff; margin: 0 5px;
      &.control-nav-active{ background: #f60 }
    }
  }
}
